<!doctype html>
<html lang="en" xmlns:th="http://www.thymeleaf.org">
<head th:include="common/common::header">
    <title>后台登录-X-admin2.0</title>

</head>
<body>
<!-- 顶部开始 -->
<div class="container">

    <div id="showEmpDom" style="display: none;">
        <form id="updateEmployee" autocomplete="off" class="layui-form" action="/dangxia/login/updateEmployee">
            <div class="layui-form-item">
                <div class="layui-input-inline" style="width:170px;">
                    <input type="hidden" th:value="${employee.id}" name="id" id="updId"/>
                </div>
            </div>
            <div class="layui-form-item">
                <label class="layui-form-label">登录名<span class="x-red">*</span>:</label>
                <div class="layui-input-inline" style="width:170px;">
                    <input id="updLoginname"  type="text"  th:value="${employee.empLoginname}" name="empLoginname" disabled lay-verify="required|strSize"
                           style="width: 160px;" placeholder="唯一的登入名"
                           autocomplete="off"
                           class="layui-input">
                </div>
                <label class="layui-form-label" style="width: 70px;">电子邮箱<span class="x-red"></span>:</label>
                <div class="layui-input-inline">
                    <input id="updEmail" type="text" style="width: 160px;" th:value="${employee.empEmail}" name="empEmail" placeholder="没有为空"
                           lay-verify="myEmail" autocomplete="off" class="layui-input">
                </div>
            </div>
            <div class="layui-form-item">
                <label class="layui-form-label">员工姓名<span class="x-red">*</span>:</label>
                <div class="layui-input-inline" style="width:170px;">
                    <input id="updName" type="text" th:value="${employee.empName}" name="empName" lay-verify="required" style="width: 160px;"
                           placeholder="请输入"
                           autocomplete="off"
                           class="layui-input">
                </div>
                <label class="layui-form-label" style="width: 70px;">修改密码<span class="x-red">*</span>:</label>
                <div class="layui-input-inline">
                    <input id="updEmp1" type="password" name="empPassword" style="width: 160px;"
                           lay-verify="updSize" placeholder="输入即为更改" autocomplete="off" class="layui-input">
                </div>
            </div>
            <div class="layui-form-item">
                <label class="layui-form-label">性别<span class="x-red">*</span>:</label>
                <div class="layui-input-inline" style="width:170px;">
                    <input type="radio" id="updnSex" name="empSex" value="1" th:field="*{employee.empSex}" title="男" checked>
                    <input type="radio" id="updvSex" name="empSex" value="0" th:field="*{employee.empSex}" title="女">
                </div>
                <label class="layui-form-label" style="width: 70px;">确认密码<span class="x-red">*</span>:</label>
                <div class="layui-input-inline">
                    <input id="updEmp2" type="password" lay-verify="updSize" style="width: 160px;"
                           placeholder="再次输入密码" autocomplete="off" class="layui-input">
                </div>
            </div>
            <div class="layui-form-item">
                <div class="layui-inline">
                    <label class="layui-form-label">手机号<span class="x-red">*</span>:</label>
                    <div class="layui-input-inline">
                        <input id="updPhone" type="tel" th:value="${employee.empPhone}" name="empPhone" style="width: 160px;" placeholder="手机号码"
                               lay-verify="required|phone" autocomplete="off"
                               class="layui-input">
                    </div>
                </div>
            </div>
            <div class="layui-form-item">
                <div class="layui-input-block">
                    <button class="layui-btn" lay-submit lay-filter="update">修改</button>
                </div>
            </div>
        </form>
    </div>

    <div class="logo"><a href="./index.html">X-admin v2.0</a></div>
    <div class="left_open">
        <i title="展开左侧栏" class="iconfont">&#xe699;</i>
    </div>
    <ul class="layui-nav left fast-add" lay-filter="">
        <li class="layui-nav-item">
            <a href="javascript:;">+新增</a>
            <dl class="layui-nav-child"> <!-- 二级菜单 -->
                <dd><a onclick="x_admin_show('资讯','http://www.baidu.com')"><i class="iconfont">&#xe6a2;</i>资讯</a></dd>
                <dd><a onclick="x_admin_show('图片','http://www.baidu.com')"><i class="iconfont">&#xe6a8;</i>图片</a></dd>
                <dd><a onclick="x_admin_show('用户','http://www.baidu.com')"><i class="iconfont">&#xe6b8;</i>用户</a></dd>
            </dl>
        </li>
    </ul>
    <ul class="layui-nav right" lay-filter="">
        <li class="layui-nav-item">
            <a href="javascript:;" th:text="${employee.empName}"></a>
            <dl class="layui-nav-child"> <!-- 二级菜单 -->
                <dd><a onclick="showInfo()">个人信息</a></dd>
                <dd><a href="/dangxia/login/toLogin">切换帐号</a></dd>
                <dd><a id="logout" href="/dangxia/login/toLogout">退出</a></dd>
            </dl>
        </li>
        <li class="layui-nav-item to-index"><a href="/">前台首页</a></li>
    </ul>

</div>
<!-- 顶部结束 -->
<!-- 中部开始 -->
<!-- 左侧菜单开始 -->
<div class="left-nav">
    <div id="side-nav">
        <ul id="nav">
            <li th:each="menu:${menus}">
                <a href="javascript:;">
                    <i class="iconfont">&#xe6b8;</i>
                    <cite th:text="${menu.title}"></cite>
                    <i class="iconfont nav_right">&#xe697;</i>
                </a>
                <ul class="sub-menu">
                    <li th:each="child:${menu.child}">
                        <a th:_href="${child.permiUrl}">
                            <i class="iconfont">&#xe6a7;</i>
                            <cite th:text="${child.title}"></cite>
                        </a>
                    </li >
                </ul>
            </li>
        </ul>
    </div>
</div>
<!-- <div class="x-slide_left"></div> -->
<!-- 左侧菜单结束 -->
<!-- 右侧主体开始 -->
<div class="page-content">
    <div class="layui-tab tab" lay-filter="xbs_tab" lay-allowclose="false">
        <ul class="layui-tab-title">
            <li class="home"><i class="layui-icon">&#xe68e;</i>我的桌面</li>
        </ul>
        <div class="layui-tab-content">
            <div class="layui-tab-item layui-show">
                <iframe src='/dangxia/welcome/toWelcome' frameborder="0" scrolling="yes" class="x-iframe"></iframe>
            </div>
        </div>
    </div>
</div>
<div class="page-content-bg">

</div>
<!-- 右侧主体结束 -->
<!-- 中部结束 -->
<!-- 底部开始 -->
<div class="footer">
    <div class="copyright">Copyright ©2017 x-admin v2.3 All Rights Reserved</div>
</div>
<script type="text/javascript" th:inline="none">

    /*数据表格*/
    layui.use(['table', 'form'], function () {
        var table = layui.table;
        var form = layui.form;

        //自定义表单验证规则
        form.verify({
            myEmail: [/^\s*$|^[a-zA-Z0-9_.-]+@[a-zA-Z0-9-]+(\.[a-zA-Z0-9-]+)*\.[a-zA-Z0-9]{2,6}$/, "邮箱格式不正确"],
            strSize: [/^[\S]{4,15}$/, "长度为4-15"],
            updSize: [/^\s*$|^[\S]{4,15}$/, "长度为4-15"]
        })
        /*监听修改员工提交*/
        form.on('submit(update)', function (data) {
            //比较两次密码
            if ($("#updEmp2").val() != $("#updEmp1").val()) {
                layer.msg("两次密码不一致");
                return false;
            }
            //提交数据表单
            $("#updateEmployee").ajaxForm(function (data) {
                if (data.code == 0) {
                    layer.msg("修改成功");
                    if ($("#updEmp1").val()!="") {
                        window.location.href="/dangxia/login/logout";
                    }
                    layui.form.render();
                    layer.closeAll();
                }
            })
        });
    });

    //显示个人信息
    function showInfo() {
        layer.open({
            type: 1,
            title: "个人信息",
            area: ['600px', '500px'],
            content: $('#showEmpDom')
        });
        layer.ready(function () {
            /*打开之后先清空表单*/
            $("#updateEmployee")[0].reset();
        });
    }
</script>
</body>
</html>